import React, { useEffect, useState } from 'react'
import { useLoaderData } from "react-router-dom";
import styles from './css/cart-recommend/index.module.scss'


export default function CartRecommend() {
  const [recommend, setRecommend] = useState([])
  const { recom } = useLoaderData();

  useEffect(() => {
    setRecommend(recom)
  })

  return (
    <div className={styles["recommend"]}>
      <h2>商品推荐</h2>
      <ul>
        {recommend.map((item, i) => (
          <li key={i}>
            <a href="#">
              <img src={"//oss.51cocoa.com/" + item?.img_url} alt={item?.name} />
            </a>
          </li>
        ))}

      </ul>
    </div>
  )
}
